import * as echarts from 'echarts';
export const optionReddValue = {
	tooltip: {
		trigger: 'axis',
		axisPointer: {
			lineStyle: {
				color: '#57617B'
			},
		},
		textStyle: {
			fontSize: 8,
		}
	},
	grid: {
		height: '88%',
		left: '2%',
		right: '5%',
		bottom: '10%',
		containLabel: true
	},
	xAxis: [{
		type: 'category',
		boundaryGap: false,
		axisLine: {
			show: false,
			lineStyle: {
				color: '#fff'
			}
		},
		axisLabel: {
			textStyle: {
				fontSize: 12,
				color: '#fff'
			}
		},
		axisTick: {
			show: false
		},
		data: [
			'01日',
			'02日',
			'03日',
			'04日',
			'05日',
			'06日',
			'07日',
			'08日',
			'09日',
			'10日',
			'11日',
			'12日',
			'13日',
			'14日',
			'15日',
			'16日',
			'17日',
			'18日',
			'19日',
			'20日',
			'21日',
			'22日',
			'23日',
			'24日',
			'25日',
			'26日',
			'27日',
			'28日',
			'29日',
			'30日'
		]
	}],
	yAxis: [{
		type: 'value',
		name: '',
		axisTick: {
			show: false
		},
		axisLine: {
			textStyle: {
				color: '#fff'
			},
			lineStyle: {
				color: 'rgba(255,255,255,.3)'
			}
		},
		axisLabel: {
			margin: 10,
			textStyle: {
				fontSize: 12,
				color: '#fff'
			}
		},
		splitLine: {
			lineStyle: {
				color: '#57617B'
			}
		}
	}],
	series: [{
			name: '上月',
			type: 'line',
			smooth: true,
			symbol: 'circle',
			symbolSize: 8,
			showSymbol: false,
			lineStyle: {
				normal: {
					width: 1
				}
			},
			areaStyle: {
				normal: {
					color: {
						colorStops: [{
								offset: 0,
								color: 'rgba(137, 189, 27, 0.3)'
							},
							{
								offset: 0.8,
								color: 'rgba(137, 189, 27, 0)'
							}
						],
						x: 0,
						y: 0,
						x2: 0,
						y2: 1,
						type: 'linear',
						global: false
					},
					shadowColor: 'rgba(0, 0, 0, 0.1)',
					shadowBlur: 10
				}
			},
			itemStyle: {
				normal: {
					color: 'rgb(255,228,181)',
					borderColor: 'rgba(255,228,181,0.2)',
					borderWidth: 12
				}
			},
			data: [
				'200.00',
				'200.00',
				'200.00',
				'200.00',
				'200.00',
				'200.00',
				'200.00',
				'200.00',
				'200.00',
				'200.00',
				'200.00',
				'200.00',
				'200.00',
				'200.00',
				'200.00',
				'200.00',
				'200.00',
				'200.00',
				'200.00',
				'200.00',
				'200.00',
				'200.00',
				'200.00',
				'200.00',
				'200.00',
				'200.00',
				'200.00',
				'200.00',
				'200.00',
				'200.00'
			]
		},
		{
			name: '本月',
			type: 'line',
			smooth: true,
			symbol: 'circle',
			symbolSize: 8,
			showSymbol: false,
			lineStyle: {
				normal: {
					width: 1
				}
			},
			areaStyle: {
				normal: {
					color: {
						colorStops: [{
								offset: 0,
								color: 'rgba(0, 136, 212, 0.3)'
							},
							{
								offset: 0.8,
								color: 'rgba(0, 136, 212, 0)'
							}
						],
						x: 0,
						y: 0,
						x2: 0,
						y2: 1,
						type: 'linear',
						global: false
					},
					shadowColor: 'rgba(0, 0, 0, 0.1)',
					shadowBlur: 10
				}
			},
			itemStyle: {
				normal: {
					color: 'rgb(51, 163, 225)',
					borderColor: 'rgba(51, 163, 225,0.2)',
					borderWidth: 12
				}
			},
			data: [
				'100.00',
				'100.00',
				'100.00',
				'100.00',
				'100.00',
				'100.00',
				'100.00',
				'100.00',
				'100.00',
				'100.00',
				'100.00',
				'100.00',
				'100.00',
				'100.00',
				'100.00',
				'100.00',
				'100.00',
				'100.00',
				'100.00',
				'100.00',
				'100.00',
				'100.00',
				'100.00',
				'100.00',
				'100.00',
				'100.00',
				'100.00',
				'100.00',
				'100.00',
				'100.00'
			]
		}
	]
};
export const optionCarbonValue = {
	tooltip: {
		trigger: 'axis',
		axisPointer: {
			lineStyle: {
				color: '#57617B',
			},
		},
	},
	legend: {
		icon: 'rect',
		itemWidth: 14,
		itemHeight: 3,
		itemGap: 60,
		data: ['上年度碳排放', '本年度碳排放'],
		bottom: '-1',
		// left:'0',		
		textStyle: {
			fontSize: 12,
			color: '#fff',
		},
	},
	grid: {
		width: '97%',
		height: '80%',
		left: '1%',
		bottom: '20',
		containLabel: true,
	},
	xAxis: [{
		type: 'category',
		boundaryGap: false,
		axisLine: {
			show: false,
			lineStyle: {
				color: '#fff',
			},
		},
		axisTick: {
			show: false,
		},
		data: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12],
	}, ],
	yAxis: [{
		type: 'value',
		name: '',
		axisTick: {
			show: false,
		},
		axisLine: {
			textStyle: {
				color: '#fff',
			},
			lineStyle: {
				color: 'rgba(255,255,255,.3)',
			},
		},
		axisLabel: {
			margin: 10,
			textStyle: {
				fontSize: 14,
				color: '#fff',
			},
		},
		splitLine: {
			lineStyle: {
				color: '#57617B',
			},
		},
	}, ],
	series: [{
			name: '上年度碳排放',
			type: 'line',
			smooth: true,
			symbol: 'circle',
			symbolSize: 5,
			showSymbol: false,
			lineStyle: {
				normal: {
					width: 1,
				},
			},
			areaStyle: {
				normal: {
					color: {
						colorStops: [{
							offset: 0,
							color: 'rgba(137, 189, 27, 0.3)',
						}, {
							offset: 0.8,
							color: 'rgba(137, 189, 27, 0.1)'
						}],
					},
					shadowColor: 'rgba(0, 0, 0, 0.1)',
					shadowBlur: 10,
				},
			},
			itemStyle: {
				normal: {
					color: 'rgb(255,228,181)',
					borderColor: 'rgba(255,228,181,0.2)',
					borderWidth: 12
				}
			},
			data: [0, 11, 22, 33, 33, 33, 66, 33, 33, 33, 22, 0],
		},
		{
			name: '本年度碳排放',
			type: 'line',
			smooth: true,
			symbol: 'circle',
			symbolSize: 5,
			showSymbol: false,
			lineStyle: {
				normal: {
					width: 1,
				},
			},
			areaStyle: {
				normal: {
					color: {
						colorStops: [{
								offset: 0,
								color: 'rgba(0, 136, 212, 0.3)'
							},
							{
								offset: 0.8,
								color: 'rgba(0, 136, 212, 0)'
							}
						],
					},
					shadowColor: 'rgba(0, 0, 0, 0.1)',
					shadowBlur: 10,
				},
			},
			itemStyle: {
				normal: {
					color: 'rgb(51, 163, 225)',
					borderColor: 'rgba(51, 163, 225,0.2)',
					borderWidth: 12
				}
			},
			data: [11, 36, 22, 0, 66, 0, 22, 8, 0, 11, 66, 0],
		},
	],
};


export const tmp = [{
		name: '建筑',
		value: 10,
		color: '#1152FD'
	},
	{
		name: '可再生能源',
		value: 60,
		color: '#57DAF2'
	},
	{
		name: '绿色碳汇',
		value: 30,
		color: '#5CAAFF'
	}
]
export const optionCarbonEValue = {
	tooltip: {
		trigger: 'item'
	},
	legend: {
		orient: 'vertical',
		show: true,
		top: '24%',
		left: '48%',
		icon: 'circle',
		itemWidth: 12,
		itemHeight: 12,
		type: "scroll",
		textStyle: {
			rich: {
				whiteF: {
					color: '#fff',
					padding: [0, 4, 0, 0],
					width: 64,
					fontSize: 12,
				},
				ml: {
					color: '#fff',
					padding: [0, 2, 0, 0],
					width: 32,
					fontSize: 12
				},
				ml2: {
					color: '#93D8FF',
					padding: [0, 10, 0, 0],
					fontSize: 12
				},
			},
		},
		formatter: function(a) {
			let tmp = [{
					name: '建筑',
					value: 10,
					color: '#99D3FE'
				},
				{
					name: '可再生能源',
					value: 60,
					color: '#F4A547'
				},
				{
					name: '绿色碳汇',
					value: 30,
					color: '#F1CF2E'
				}
			]
			let temIndex = tmp.findIndex(item => item.name == a)
			tmp.forEach(item => {
				item.precent = Math.floor((item.value * 100) / 100)
			})
			return `{whiteF|${a}} {ml|${tmp[temIndex].value}} {ml2|${tmp[temIndex].precent}%}`;
		},
		data: tmp
	},
	series: [{
		name: 'airtouee',
		type: 'pie',
		left: '-48%',
		height: '100%',
		radius: ['64%', '84%'],
		avoidLabelOverlap: false,
		itemStyle: {
			normal: {
				color: (list) => {
					var colorList = [{
							colorStart: '#99D3FE',
							colorEnd: '#99D3FE',
						},
						{
							colorStart: '#F4A547',
							colorEnd: '#F4A547',
						},

						{
							colorStart: '#F1CF2E',
							colorEnd: '#F1CF2E',
						},
					];
					return new echarts.graphic.LinearGradient(1, 1, 0, 0, [{
							//左、下、右、上
							offset: 1,
							color: colorList[list.dataIndex % colorList.length]['colorStart'],
						},
						{
							offset: 0,
							color: colorList[list.dataIndex % colorList.length]['colorEnd'],
						},
					]);
				},
				borderRadius: 0,
				borderColor: '#fff',
				borderWidth: 0,
			},
		},
		label: {
			show: false,
			position: 'center',
		},
		emphasis: {
			label: {
				show: true,
				fontSize: 12,
				fontWeight: 'bold',
				formatter(a, b, c, d) {
					return `{ml|${a.name}} \n {ml2|${a.value}}`;
				},
				rich: {
					fw: {
						fontWeight: 'bold',
					},
					whiteF: {
						color: '#fff',
						fontSize: 14,
						textAlign: 'center',
						padding: [0, 0, 6, 0]
					},
					ml: {
						color: '#fff',
						fontSize: 14,
						padding: [0, 0, 6, 0],
						textAlign: 'center',
					},
					ml2: {
						color: '#93D8FF',
						fontSize: 14,
						padding: [0, 0, 0, 0],
						textAlign: 'center',
					},
				},
			},
		},
		labelLine: {
			show: false,
		},
		animationTypeUpdate: 'expansion',
		data: tmp,
	}],
	boxShadowNone: true
};
export const optionBottomLeftAValue = {
	grid: {
		bottom: '3%',
		height: '80%',
		top: '10%'
	},
	series: [{
			data: [285336],
			type: 'bar',
			xAxisIndex: 0,
			silent: true,
			barWidth: 16,
			tooltip: {
				show: false
			},
			itemStyle: {
				color: 'none',
				borderColor: '#25435B',
				borderWidth: 1
			}
		},
		{
			name: '类目1',
			stack: 'Ad',
			data: [285336],
			type: 'bar',
			barWidth: 16,
			tooltip: {
				show: false
			},
			xAxisIndex: 1,
			itemStyle: {
				color: '#76DBFB'
			}
		},
		{
			name: '类目2',
			type: 'bar',
			stack: 'Ad',
			xAxisIndex: 1,
			data: [256800],
			barWidth: 16,
			tooltip: {
				show: false
			},
			itemStyle: {
				color: {
					colorStops: [{
							offset: 0,
							color: '#264B5F'
						},
						{
							offset: 1,
							color: '#182136'
						}
					],
					x: 0,
					y: 0,
					x2: 0,
					y2: 1,
					type: 'linear',
					global: false
				}
			},
			label: {
				show: false,
				position: 'top',
				offset: [-30, 5],
				color: '#B0ECFF'
			}
		},
		{
			name: '类目2',
			type: 'bar',
			stack: 'Ad',
			xAxisIndex: 1,
			data: [1e-7],
			barWidth: 16,
			itemStyle: {
				color: 'none',
				borderColor: '#25435B'
			},
			label: {
				show: false,
				position: 'top',
				offset: [-30, 5],
				color: '#B0ECFF'
			}
		}
	],
	xAxis: [{
			data: [],
			axisLine: {
				show: false
			},
			axisLabel: {
				show: false
			},
			axisTick: {
				show: false
			}
		},
		{
			data: [],
			axisLine: {
				show: false
			},
			axisLabel: {
				show: false
			},
			axisTick: {
				show: false
			}
		}
	],
	yAxis: {
		axisLine: {
			show: false
		},
		axisLabel: {
			show: false
		},
		axisTick: {
			show: false
		},
		splitLine: {
			show: false
		},
		max: 'dataMax'
	}
};
export const optionBottomLeftBValue = {
	grid: {
		bottom: '1%',
		height: '80%',
		top: '10%'
	},
	series: [{
			data: [285000],
			type: 'bar',
			xAxisIndex: 0,
			silent: true,
			barWidth: 16,
			tooltip: {
				show: false
			},
			itemStyle: {
				color: 'none',
				borderColor: '#25435B',
				borderWidth: 1
			}
		},
		{
			name: '类目1',
			stack: 'Ad',
			data: [25800],
			type: 'bar',
			barWidth: 16,
			xAxisIndex: 1,
			itemStyle: {
				color: '#76DBFB'
			},
			label: {
				show: false,
				position: 'top',
				offset: [-30, 5],
				color: '#B0ECFF'
			}
		},
		{
			name: '类目2',
			type: 'bar',
			stack: 'Ad',
			xAxisIndex: 1,
			data: [25800],
			barWidth: 16,
			itemStyle: {
				color: {
					colorStops: [{
							offset: 0,
							color: '#264B5F'
						},
						{
							offset: 1,
							color: '#182136'
						}
					],
					x: 0,
					y: 0,
					x2: 0,
					y2: 1,
					type: 'linear',
					global: false
				}
			},
			label: {
				show: true,
				position: 'top',
				offset: [-30, 5],
				color: '#B0ECFF'
			}
		},
		{
			name: '类目2',
			type: 'bar',
			stack: 'Ad',
			xAxisIndex: 1,
			data: [1e-7],
			barWidth: 16,
			itemStyle: {
				color: 'none',
				borderColor: '#25435B'
			},
			label: {
				show: false,
				position: 'top',
				offset: [-30, 5],
				color: '#B0ECFF'
			}
		}
	],
	xAxis: [{
			data: [],
			axisLine: {
				show: false
			},
			axisLabel: {
				show: false
			},
			axisTick: {
				show: false
			}
		},
		{
			data: [],
			axisLine: {
				show: false
			},
			axisLabel: {
				show: false
			},
			axisTick: {
				show: false
			}
		}
	],
	yAxis: {
		axisLine: {
			show: false
		},
		axisLabel: {
			show: false
		},
		axisTick: {
			show: false
		},
		splitLine: {
			show: false
		},
		max: 'dataMax'
	}
};
export const optionBottomCenterValue = {
	series: [{
			type: 'liquidFill',
			radius: '75%',
			center: ['55%', '55%'],
			data: ['0.55', '0.55', '0.55'],
			color: ['rgba(43, 75, 108)'],
			backgroundStyle: {
				borderWidth: 1,
				color: 'rgb(1, 12, 27,0.2)'
			},
			label: {
				normal: {
					textStyle: {
						fontSize: 24,
						color: '#7BB6D8',
						fontFamily: 'pieFont'
					}
				}
			},
			outline: {
				show: false
			}
		},
		{
			type: 'pie',
			center: ['55%', '55%'],
			radius: ['82%', '80%'],
			hoverAnimation: false,
			data: [{
					name: '',
					value: 5,
					labelLine: {
						show: false
					},
					emphasis: {
						labelLine: {
							show: false
						},
						itemStyle: {
							color: '#76DBFB',
							normal: {
								borderColor: 'red',
								borderWidth: 2
							}
						}
					}
				},
				{
					name: '',
					value: 400,
					labelLine: {
						show: false
					},
					itemStyle: {
						color: '#81C3F7',
						normal: {
							borderColor: '#89CDFF',
							borderWidth: 1
						}
					},
					label: {
						borderRadius: '100%'
					},
					emphasis: {
						labelLine: {
							show: false
						},
						itemStyle: {
							color: '#81C3F7'
						}
					}
				},
				{
					name: '',
					value: 2,
					labelLine: {
						show: false
					},
					itemStyle: {
						color: '#81C3F7'
					},
					emphasis: {
						labelLine: {
							show: false
						},
						itemStyle: {
							color: '#81C3F7'
						}
					}
				},
				{
					name: '',
					value: 88,
					itemStyle: {
						color: '#81C3F7'
					},
					label: {
						show: false
					},
					labelLine: {
						show: false
					},
					emphasis: {
						labelLine: {
							show: false
						},
						itemStyle: {
							color: '#81C3F7'
						}
					}
				}
			]
		}
	]
};
const formatterarray = [{
	name: '电梯用电',
	value: 1.01
}, {
	name: '新风用电',
	value: 21.1
}, {
	name: '暖通用电',
	value: 54.3
}, {
	name: '照明用电',
	value: 17.6
}, {
	name: '插座用电',
	value: 5.5
}, {
	name: '其他用电',
	value: 0.5
}];
export const optionBottomRightValue = {
	series: [{
		name: 'AccessFrom',
		type: 'pie',
		radius: ['40%', '70%'],
		avoidLabelOverlap: false,
		itemStyle: {
			borderRadius: 2,
			borderWidth: 2
		},
		label: {
			show: false,
			position: 'center',
		},
		emphasis: {
			label: {
				show: true,
				fontSize: 12,
				fontWeight: 'bold',
				formatter(a, b, c, d) {
					return `{ml|${a.name}} \n {ml2|${a.value}%}`;
				},
				rich: {
					fw: {
						fontWeight: 'bold',
					},
					whiteF: {
						color: '#fff',
						textAlign: 'center',
						padding: [0, 0, 6, 0]
					},
					ml: {
						color: '#fff',
						padding: [0, 0, 6, 0],
						textAlign: 'center',
					},
					ml2: {
						color: '#93D8FF',
						padding: [0, 0, 0, 0],
						textAlign: 'center',
					},
				},
			},
		},
		data: [{
				itemStyle: {
					color: '#3D81F3'
				},
				value: '1.0',
				origin: 1,
				code: 'power_lift',
				name: '电梯用电',
				unit: '千瓦时'
			},
			{
				itemStyle: {
					color: '#75F36C'
				},
				value: '1.0',
				origin: 1,
				code: 'power_newwind',
				name: '新风用电',
				unit: '千瓦时'
			},
			{
				itemStyle: {
					color: '#76DBFB'
				},
				value: '1.0',
				origin: 1,
				code: 'power_hvac',
				name: '暖通用电',
				unit: '千瓦时'
			},
			{
				itemStyle: {
					color: '#FFEE73'
				},
				value: '1.0',
				origin: 1,
				code: 'power_lighting',
				name: '照明用电',
				unit: '千瓦时'
			},
			{
				itemStyle: {
					color: '#A56CFA'
				},
				value: '1.0',
				origin: 1,
				code: 'power_jack',
				name: '插座用电',
				unit: '千瓦时'
			},
			{
				itemStyle: {
					color: '#FFAF66'
				},
				value: '1.0',
				origin: 1,
				code: 'power_other',
				name: '其他用电',
				unit: '千瓦时'
			}
		]
	}]
};
